<template>
  <div class="container">
    <Header>
      会员
    </Header>
    <main>
      <img src="http://cdn.jisuapp.cn/static/webapp/images/franchisee/vip-banner.jpg" alt />
      <div class="card">
        <div class="cartin">
          <img src="https://img.zhichiwangluo.com/zcimgdir/album/file_5c0a37e2d7699.png" alt />
          <p>
            <span>奶茶 咫尺会员卡</span>
            <span>可享 9.00折</span>
          </p>
        </div>
        <div class="stage">有效期：永久有效</div>
      </div>
    </main>
  </div>
</template>
<style lang="scss">
@import "@/lib/reset.scss";
.container {
  header {
    @include flexbox();
    @include justify-content(space-between);
  }
  main {
    @include rect(100%, auto);
    img {
      @include rect(100%, auto);
    }
    .card {
      @include margin(0.2rem 0.1rem 0);
      @include background-color(rgb(255, 113, 0));
      @include flexbox();
      @include border-radius(0.08rem);
      @include flex-direction(column);
      @include justify-content(space-between);
      img {
        @include rect(0.35rem, 0.35rem);
        @include border-radius(50%);
        @include border(0.02rem, #ffffff, solid);
        @include display(inline-block);
        @include margin(0.12rem);
      }
      .cartin {
        @include flexbox();
        @include align-items();
        p {
          @include flexbox();
          @include flex-direction(column);
          @include color(#ffffff);
          @include font-size(.12rem);
        }
      }
    }
    .stage {
      @include background-color(rgba(0, 0, 0, 0.25));
      @include border-radius(0 0 8px 8px);
      @include text-align(right);
      @include font-size(.12rem);
      @include color(#ffffff);
      @include padding(0 .1rem);
      @include line-height(.22rem);
    }
  }
}
</style>
<script>
import Header from '@/components/header.vue'
export default {
  methods: {
    back () {
      this.$router.back()
    }
  },
  components: {
    Header
  }
}
</script>
